<template>
  <div id="Mettingarrange_container" style="height: 98%">
    <el-card>
      <div class="row1">
        <el-row :gutter="20" style="margin-top: 10px">
          <el-col :span="7" style="height: 100%">
            <table class="mytable" cellpadding="0" cellspacing="0">
              <tr class="mytr">
                <td class="mytd">会社情報</td>
              </tr>
              <tr style="height: 25px">
                <td style="border: 0.5px solid rgb(200, 200, 200) !important; padding-left: 7px">
                  {{ meettingEnterPrice }}
                </td>
              </tr>
            </table>
            <br />
            <br /><br />
            <table class="mytable" cellpadding="0" cellspacing="0">
              <tr class="mytr">
                <td class="mytd">会議室</td>
              </tr>
              <tr v-for="(item, index) in meetingRoomOptions" :key="index" class="mytr1" @click="changeMeetingName(item.label, item.value)">
                <td class="mytd1" @click="clickLi(index)" :class="{ actived: index == isactive }">{{ item.label }}</td>
              </tr>
            </table>
          </el-col>
          <el-col :span="17">
            <table class="mytable" cellpadding="0" cellspacing="0">
              <tr class="mytr">
                <td class="mytd">会議一覧({{ ces }})</td>
              </tr>
              <tr>
                <td>
                  <FullCalendar :options="calendarOptions" ref="FullCalendar"> </FullCalendar>
                </td>
              </tr>
            </table>
          </el-col>
        </el-row>
      </div>
      <el-dialog :title="meetingTitle" v-model="meetingVisible" width="32%" @close="resetChecked">
        <table class="mytable1" cellpadding="0" cellspacing="0">
          <tr class="mytr">
            <td class="mytd3">会社の名前</td>
            <td class="mytd2">
              <el-select v-model="addMeetingObj.groupEnterpriseGuid" style="width: 100%" class="paperview-input-text">
                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
              </el-select>
            </td>
          </tr>
          <tr class="mytr">
            <td class="mytd3">会議室</td>
            <td class="mytd2">
              <el-select v-model="addMeetingObj.mrId" style="width: 100%" class="paperview-input-text">
                <el-option v-for="item in meetingRoomOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
              </el-select>
            </td>
          </tr>
          <tr class="mytr">
            <td class="mytd3">会議のテーマ</td>
            <td class="mytd2">
              <el-input maxlength="200" v-model="addMeetingObj.mtittle" placeholder="" class="paperview-input-text"></el-input>
            </td>
          </tr>
          <tr class="mytr">
            <td class="mytd3">会議記述</td>
            <td class="mytd2">
              <el-input maxlength="500" v-model="addMeetingObj.mcontent" placeholder="" class="paperview-input-text"></el-input>
            </td>
          </tr>
          <tr class="mytr">
            <td class="mytd3">会議時間</td>
            <td class="mytd2">
              <el-date-picker v-model="value4" style="width: 100%; border: 0" type="date" placeholder=" " value-format="YYYY-MM-DD" format="YYYY-MM-DD"> </el-date-picker>
            </td>
          </tr>
          <tr class="mytr">
            <td class="mytd3">期間</td>
            <td class="mytd2">
              <el-time-picker style="border: 0; width: 210px" v-model="value2" is-range range-separator="-" value-format="HH:mm:ss" format="HH:mm:ss" :clearable="false"> </el-time-picker>
            </td>
          </tr>
          <tr class="mytr" v-if="flag == 0 && aidName != this.$store.getters.showId">
            <td class="mytd3">発起人</td>
            <td class="mytd2">
              <button style="height: 27px; border-radius: 3px; background-color: rgb(0, 150, 136); color: #ffffff; margin-left: 10px; margin-right: 10px; margin-bottom: 5px; margin-top: 5px">
                {{ aidName }}
              </button>
            </td>
          </tr>
          <tr class="mytr">
            <td class="mytd3">必須出席</td>
            <td class="mytd2">
              <div class="tddiv">
                <el-tag
                  v-for="mpUserName in visitedTableList1"
                  style="background-color: #009688; color: #ffffff; margin-left: 10px; margin-right: 10px; margin-bottom: 5px; margin-top: 5px"
                  :key="mpUserName"
                  closable
                  :disable-transitions="false"
                  @close="handleClose(mpUserName, 1)"
                  effect="dark"
                >
                  {{ mpUserName.name }}
                </el-tag>
                <el-button
                  type="danger"
                  icon="el-icon-plus"
                  @click="openMustMeeting(1)"
                  v-if="this.flag == 1 || aidName == this.$store.getters.showId"
                  style="margin-left: 10px; margin-right: 10px; margin-bottom: 5px; margin-top: 5px"
                ></el-button>
              </div>
            </td>
          </tr>
          <tr class="mytr">
            <td class="mytd3">可能な出席</td>
            <td class="mytd2">
              <div class="tddiv">
                <el-tag
                  v-for="mpUserName in visitedTableList2"
                  style="background-color: #009688; color: #ffffff; margin-left: 10px; margin-right: 10px; margin-bottom: 5px; margin-top: 5px"
                  :key="mpUserName"
                  closable
                  :disable-transitions="false"
                  @close="handleClose(mpUserName, 2)"
                  effect="dark"
                >
                  {{ mpUserName.name }}
                </el-tag>
                <el-button
                  type="danger"
                  icon="el-icon-plus"
                  @click="openMustMeeting(0)"
                  v-if="this.flag == 1 || aidName == this.$store.getters.showId"
                  style="margin-left: 10px; margin-right: 10px; margin-bottom: 5px; margin-top: 5px"
                ></el-button>
              </div>
            </td>
          </tr>
        </table>
        <div style="text-align: center; margin-top: 30px">
          <!-- 新增的一个按钮 -->
          <el-button type="primary" v-if="flag == 1" @click="saveMeeting">新規</el-button>
          <!-- 编辑的两个按钮 -->
          <el-button type="primary" v-if="flag == 0 && aidName == this.$store.getters.showId" @click="saveUpdateMeeting" v-preventReClick>保存</el-button>
          <el-button type="primary" v-if="flag == 0 && aidName == this.$store.getters.showId" @click="removeMeeting">削除</el-button>
        </div>
      </el-dialog>
      <el-dialog title="人員選択" v-model="mustmeetinginnerVisible" width="38%" append-to-body @close="resetChecked">
        <el-card class="card1">
          <div class="cardtree">
            <el-tree :data="treeData" default-expand-all show-checkbox node-key="id" ref="tree" highlight-current :props="defaultProps" :default-checked-keys="musttreeDataChecked"> </el-tree>
          </div>
          <el-button type="primary" icon="el-icon-circle-check" class="save1" @click="getCheckedNodes" v-preventReClick>保存</el-button>
        </el-card>
      </el-dialog>
      <el-dialog title="人員選択" v-model="canmeetinginnerVisible" width="38%" append-to-body @close="resetChecked">
        <el-card class="card1">
          <div class="cardtree">
            <el-tree :data="treeData1" default-expand-all show-checkbox node-key="id" ref="tree" highlight-current :props="defaultProps" :default-checked-keys="cantreeDataChecked"> </el-tree>
          </div>
          <el-button type="primary" icon="el-icon-circle-check" class="save1" @click="getCheckedNodes" v-preventReClick>保存</el-button>
        </el-card>
      </el-dialog>
    </el-card>
  </div>
</template>

<script>
import FullCalendar from '@fullcalendar/vue3'
import dayGridPlugin from '@fullcalendar/daygrid'
import interactionPlugin from '@fullcalendar/interaction'
import timeGridPlulgin from '@fullcalendar/timegrid'
import '@fullcalendar/core/locales/zh-cn' // 支持中文
import momentPlugin from '@fullcalendar/moment'
export default {
  components: {
    FullCalendar // make the <FullCalendar> tag available
  },
  data() {
    return {
      meetingTitle: '会議新規',
      treeData: [],
      treeData1: [],
      meetingRoomOptions: [],
      // 树形数据默认选中数据列表
      musttreeDataChecked: [],
      cantreeDataChecked: [],
      beginMeetTimeary: [],
      endMeetTimeary: [],
      entervalue: '',
      defaultProps: {
        children: 'children',
        label: 'name'
      },
      value2: [],
      value4: '',
      flag: 1,
      isactive: 0,
      t: '',
      removeEventId: '',
      meetingVisible: false,
      mustmeetinginnerVisible: false,
      canmeetinginnerVisible: false,
      year: '',
      month: '',
      calenderApi: {},
      // 会议表的配置对象文件
      calendarOptions: {
        plugins: [dayGridPlugin, interactionPlugin, timeGridPlulgin, momentPlugin],
        customButtons: {
          prev: {
            // this overrides the prev button
            text: 'PREV',
            click: (e) => {
              let calendarApi = this.$refs.FullCalendar.getApi()
              calendarApi.prev()
              this.defaultDate = calendarApi.currentData.viewTitle
              console.log(this.defaultDate)
              window.sessionStorage.setItem('currentDay', this.defaultDate)
              this.getMeetingAllInfo()
            }
          },
          next: {
            // this overrides the next button
            text: 'NEXT',
            click: (e) => {
              console.log('eventNext')
              let calendarApi = this.$refs.FullCalendar.getApi()
              calendarApi.next() //点击下一天/周
              this.defaultDate = calendarApi.currentData.viewTitle //获取当前视图的时间
              console.log(this.defaultDate)
              window.sessionStorage.setItem('currentDay', this.defaultDate)
              this.getMeetingAllInfo()
            }
          },
          today: {
            text: 'today',
            click: (e) => {
              console.log(e)
              let calendarApi = this.$refs.FullCalendar.getApi()
              calendarApi.today() //点击今天的事件
              this.defaultDate = calendarApi.currentData.viewTitle //获取当前视图的时间
              window.sessionStorage.setItem('currentDay', this.defaultDate)
              this.getMeetingAllInfo()
            }
          }
        },
        headerToolbar: {
          right: 'prev,next today',
          left: 'title'
          // right: 'dayGridMonth,timeGridWeek,timeGridDay'
        },
        initialView: 'timeGridWeek',
        titleFormat: 'YYYY.MM.DD',
        locale: 'ja',
        timeZone: 'UTC',
        slotMinTime: '07:00:00',
        slotMaxTime: '23:00:00',
        dateClick: this.handleDateClick,
        select: this.handleSelect,
        eventClick: this.handleEventClick,
        allDaySlot: false,
        slotLabelFormat: ['HH:mm'],
        scrollTime: '09:00:00',
        selectable: true,
        selectMirror: true,
        events: []
      },
      // 主页查询总的会议信息数据
      allMeetingInfo: {
        searchbean: {
          aidName: '',
          groupEnterpriseGuid: this.$store.getters.showentergroup,
          minBTime: '',
          minETime: '',
          mrId: '',
          mtittle: ''
        },
        indexPage: 1,
        pageSize: 10
      },
      // 新增与编辑的表单数据传递到后台的对象
      addMeetingObj: {
        // 能参与者id集合
        canJoin: [],
        delflg: '1',
        aidName: '',
        groupEnterpriseGuid: this.$store.getters.showentergroup,
        // 发起者id
        maid: this.$store.getters.showuserGuid,
        mbtime: '2021-12-07 09:00:00',
        metime: '2021-12-07 10:00:00',
        mid: '',
        mcontent: '',
        // 会议室id
        mrId: '',
        mtittle: '',
        // 必须参与者id集合
        mustJoin: []
      },
      ces: '',
      meetingBgc: 'myMt',
      options: [],
      visitedTableList1: [],
      visitedTableList2: [],
      meettingEnterPrice: ''
    }
  },
  created() {
    this.enterpriseName()
  },
  mounted() {
    this.calenderApi = this.$refs.FullCalendar.getApi()
    console.log(this.calenderApi)
    console.log(this.$refs.FullCalendar.getApi())
    console.log(this.$refs.FullCalendar.getApi().currentData.viewTitle)
    window.sessionStorage.setItem('currentDay', this.$refs.FullCalendar.getApi().currentData.viewTitle)
  },
  methods: {
    getMonthDays(year, month) {
      let monthStartDate = new Date(year, month, 1)
      let monthEndDate = new Date(year, month + 1, 1)
      let days = (monthEndDate - monthStartDate) / (1000 * 60 * 60 * 24)
      return days
    },
    // 点击到的单元格更换背景颜色
    clickLi(index) {
      this.isactive = index
    },
    // 点击不同会议室，→_→的会议时间表上会议室名称的改变
    changeMeetingName(name, id) {
      this.calendarOptions.events = []
      this.ces = name
      this.allMeetingInfo.searchbean.mrId = id
      this.addMeetingObj.mrId=id
      this.getMeetingAllInfo()
    },
    // 树形数据获取
    meetingSearchccuserids() {
      this.axios
        .post('/subgroup/groupEnterpriseGuid/exceptLogin/treeUserInfo', {
          groupEnterpriseGuid: this.$store.getters.showentergroup,
          userinfoGuid: this.$store.getters.showuserGuid
        })
        .then((res) => {
          console.log(res)
          this.treeData[0] = res.data.data
          this.treeData1[0] = res.data.data
        })
        .catch((error) => {
          console.log(error)
        })
    },
    // 获取所有公司和会议室
    async enterpriseName() {
      // 获取公司
      const { data: res } = await this.axios.post('/role/selectAllEnterprise')
      if (res.success === 1) {
        const enterPrise = res.data
        console.log(enterPrise)
        enterPrise.forEach((item) => {
          if (item.groupEnterpriseGuid === this.$store.getters.showentergroup) this.meettingEnterPrice = item.enterpriseName
          this.options.push({ value: item.groupEnterpriseGuid, label: item.enterpriseName })
        })
        console.log(this.options)
        this.entervalue = this.$store.getters.showentergroup
        await this.getMeetingRoom()
        await this.getMeetingAllInfo()
      }
    },
    async getMeetingRoom() {
      // 获取会议室
      const { data: res } = await this.axios.post('/meetingroom/select/list', {
        indexPage: 1,
        pageSize: 10,
        searchbean: {
          groupEnterpriseGuid: this.$store.getters.showentergroup,
          mrName: ''
        }
      })
      if (res.success === 1) {
        res.data.list.forEach((item) => {
          this.meetingRoomOptions.push({ value: item.mrId, label: item.mrName })
        })
        this.ces = this.meetingRoomOptions[0].label
        this.allMeetingInfo.searchbean.mrId = this.meetingRoomOptions[0].value
        this.addMeetingObj.mrId=this.meetingRoomOptions[0].value
        console.log(this.meetingRoomOptions[0].value)
        console.log(this.meetingRoomOptions)
      }
    },
    // 当选择结束的时候获取开始和结束时间,新增会议
    handleSelect(info) {
      console.log(info)
      console.log(info.endStr)
      for (let i = 0; i < this.beginMeetTimeary.length; i++)
        if (
          (this.beginMeetTimeary[i] < info.endStr && this.endMeetTimeary[i] > info.endStr) ||
          (info.startStr <= this.beginMeetTimeary[i] && info.endStr >= this.endMeetTimeary[i]) ||
          (this.beginMeetTimeary[i] < info.startStr && this.endMeetTimeary[i] > info.startStr)
        ) {
          this.$message.warning('期間は既に予約されています')
          return false
        }
      if (info.startStr.slice(0, 10) !== info.endStr.slice(0, 10)) return this.$message.warning('同じ日の期間のみを選択できます')
      this.flag = 1
      this.meetingTitle = '会議新規'
      // 初始化
      this.meetingSearchccuserids()
      this.addMeetingObj.mtittle = ''
      this.addMeetingObj.mcontent = ''
      this.value4 = ''
      this.value2 = []
      this.visitedTableList1 = []
      this.addMeetingObj.mustJoin = []
      this.visitedTableList2 = []
      this.addMeetingObj.canJoin = []
      console.log('form' + info.startStr + ' to ' + info.endStr)
      this.meetingVisible = true
      this.value4 = info.startStr.slice(0, 10)
      this.value2[0] = info.startStr.slice(11, 19)
      this.value2[1] = info.endStr.slice(11, 19)
      console.log(this.value2)
      console.log(info)
      console.log(this.addMeetingObj.mtittle)
      console.log(this.addMeetingObj.mcontent)
    },
    // 树形数据的复选框选中,保存按钮
    getCheckedNodes() {
      if (this.t === 1) {
        this.visitedTableList1 = []
        this.addMeetingObj.mustJoin = []
        const treeDataList = this.$refs.tree.getCheckedNodes()
        treeDataList.forEach((item) => {
          if (item.pid !== null && item.pid !== this.$store.getters.showentergroup) {
            this.visitedTableList1.push({
              name: item.name,
              id: item.id
            })
            this.addMeetingObj.mustJoin.push(item.id)
          }
        })
        this.mustmeetinginnerVisible = false
        this.musttreeDataChecked = this.addMeetingObj.mustJoin
      }
      if (this.t === 0) {
        this.visitedTableList2 = []
        this.addMeetingObj.canJoin = []
        const treeDataList = this.$refs.tree.getCheckedNodes()
        treeDataList.forEach((item) => {
          if (item.pid !== null && item.pid !== this.$store.getters.showentergroup) {
            this.visitedTableList2.push({
              name: item.name,
              id: item.id
            })
            this.addMeetingObj.canJoin.push(item.id)
          }
        })
        this.canmeetinginnerVisible = false
        this.cantreeDataChecked = this.addMeetingObj.canJoin
      }
    },
    // 新增的保存按钮
    saveMeeting() {
      this.addMeetingObj.mid = ''
      this.addMeetingObj.mbtime = this.value4 + ' ' + this.value2[0]
      this.addMeetingObj.metime = this.value4 + ' ' + this.value2[1]
      let date = new Date()
      let year = date.getFullYear()
      let month = (date.getMonth() + 1 + '').padStart(2, '0')
      let day = (date.getDate() + '').padStart(2, '0')
      const todayTime = year + '-' + month + '-' + day
      console.log(todayTime)
      console.log(this.value4)
      if (this.value4 < todayTime) return this.$message.warning('過去の期間は選択できません')
      console.log(this.addMeetingObj)
      // if (this.addMeetingObj.mrId === '' || this.addMeetingObj.mtittle === '' || this.addMeetingObj.mcontent === '' || this.addMeetingObj.mbtime === '' || this.addMeetingObj.metime === '')
      //   return this.$message.warning('データが未記入')
      if (this.addMeetingObj.mtittle === '') return this.$message.warning('会議のテーマをご入力してください')
      if (this.addMeetingObj.mcontent === '') return this.$message.warning('会議記述をご入力してください')
      if (this.value4 === null) return this.$message.warning('会議時間を選択してください')
      if (this.value2[0] === this.value2[1]) return this.$message.warning('期間をご再度選んでください')
      this.axios.post('/meeting/insert', this.addMeetingObj).then((res) => {
        if (res.data.success === 0) return this.$message.warning(res.data.msg)
        console.log(res)
        this.meetingVisible = false
        this.getMeetingAllInfo()
        // 初始化数据
        // this.addMeetingObj.mtittle = ''
        // this.addMeetingObj.mcontent = ''
        this.value4 = ''
        this.value2 = []
        this.visitedTableList1 = []
        this.visitedTableList2 = []
        this.musttreeDataChecked = []
        this.cantreeDataChecked = []
      })
    },
    // 编辑窗口打开以及编辑页面渲染
    handleEventClick(info) {
      console.log(info)
      this.flag = 0
      this.meetingTitle = '会議編集'
      this.meetingVisible = true
      this.removeEventId = info.event.id
      console.log(info.event.title)
      console.log(info.event.id)
      this.axios
        .post('/meeting/select', {
          mid: info.event.id
        })
        .then((res) => {
          this.aidName = res.data.data.aidName
          console.log(res)
          // 渲染编辑页面
          const list = res.data.data
          console.log(list)
          this.addMeetingObj.groupEnterpriseGuid = list.groupEnterpriseGuid
          this.addMeetingObj.mrId = list.mrId
          this.addMeetingObj.mtittle = list.mtittle
          this.addMeetingObj.mcontent = list.mcontent
          this.value4 = list.metime.slice(0, 10)
          this.value2[0] = list.mbtime.slice(11, 19)
          this.value2[1] = list.metime.slice(11, 19)
          this.visitedTableList1 = []
          this.addMeetingObj.mustJoin = []
          this.visitedTableList2 = []
          this.addMeetingObj.canJoin = []
          this.meetingSearchccuserids()
          list.meetingpersonsVos.forEach((item) => {
            if (item.mpType === '2') {
              this.visitedTableList1.push({
                name: item.mpUserName,
                id: item.userinfoGuid
              })
              this.addMeetingObj.mustJoin.push(item.userinfoGuid)
            }
            if (item.mpType === '3') {
              this.visitedTableList2.push({
                name: item.mpUserName,
                id: item.userinfoGuid
              })
              this.addMeetingObj.canJoin.push(item.userinfoGuid)
            }
          })
        })
    },
    // 会议修改保存按钮事件
    saveUpdateMeeting() {
      console.log(this.addMeetingObj)
      this.addMeetingObj.mid = this.removeEventId
      // if (this.addMeetingObj.mrId === '' || this.addMeetingObj.mtittle === '' || this.addMeetingObj.mcontent === '' || this.addMeetingObj.mbtime === '' || this.addMeetingObj.metime === '')
      //   return this.$message.warning('データが未記入')
      if (this.addMeetingObj.mtittle === '') return this.$message.warning('会議のテーマをご入力してください')
      if (this.addMeetingObj.mcontent === '') return this.$message.warning('会議記述をご入力してください')
      if (this.value4 === null) return this.$message.warning('会議時間を選択してください')
      this.addMeetingObj.aidName = this.$store.getters.showId
      this.addMeetingObj.mbtime = this.value4 + ' ' + this.value2[0]
      this.addMeetingObj.metime = this.value4 + ' ' + this.value2[1]
      if (this.value2[0] === this.value2[1]) return this.$message.warning('期間をご再度選んでください')
      this.axios.put('/meeting/update', this.addMeetingObj).then((res) => {
        console.log(res)
        if (res.data.success === 0) return this.$message.warning(res.data.msg)
        this.getMeetingAllInfo()
        this.meetingVisible = false
      })
    },

    // 查询所有的会议信息
    getMeetingAllInfo() {
      this.$nextTick(() => {
        let d = window.sessionStorage.getItem('currentDay')
        console.log(d)
        this.year = d.slice(0, 10)
        this.month = d.slice(13, 23)
        console.log(this.year)
        console.log(this.month)
        this.allMeetingInfo.searchbean.minBTime = this.year.replaceAll('.', '-')
        this.allMeetingInfo.searchbean.minETime = this.month.replaceAll('.', '-')
        console.log(this.allMeetingInfo)
        this.axios.post('/meeting/select/list', this.allMeetingInfo).then((res) => {
          if (res.data.success === 1) {
            this.addMeetingObj.mrId = this.allMeetingInfo.searchbean.mrId
            console.log(this.allMeetingInfo)
            console.log(res)
            const list = res.data.data
            console.log(list)
            this.calendarOptions.events = []
            this.beginMeetTimeary = []
            this.endMeetTimeary = []
            list.forEach((item) => {
              // if (item.mrId === this.allMeetingInfo.searchbean.mrId) {
              const mbtime = item.mbtime.replace(/[\s]+/g, 'T')
              const metime = item.metime.replace(/[\s]+/g, 'T')
              if (item.aidName !== this.$store.getters.showId) this.meetingBgc = '#84afda'
              else this.meetingBgc = '#409eff'
              this.beginMeetTimeary.push(mbtime + 'Z')
              this.endMeetTimeary.push(metime + 'Z')
              this.calendarOptions.events.push({
                start: mbtime,
                end: metime,
                color: this.meetingBgc,
                title: item.mtittle,
                id: item.mid
              })
              // }
            })
          }
        })
      })
      // console.log(this.getMonthDays(this.year, this.month - 1))
    },
    // 弹窗关闭事件
    meetingClose() {
      // console.log(this.calendarOptions.events)
    },
    // 打开必须参加者和可以参加者的弹窗事件
    openMustMeeting(f) {
      // flag为1是新增，0是编辑，f为1时是必须出席
      if (this.flag === 1 && f === 1) {
        // this.$nextTick()是指数据被修改后，获取更新后的dom在渲染出来
        this.$nextTick(() => {
          this.$refs.tree.setCheckedKeys([])
        })
        this.musttreeDataChecked = []
        console.log(this.musttreeDataChecked)
        this.addMeetingObj.canJoin.forEach((item) => {
          this.treeData[0].children.forEach((ele) => {
            ele.children.forEach((ele1, index) => {
              if (item === ele1.id) ele.children.splice(index, 1)
            })
          })
        })
        this.treeData[0].children.forEach((ele, index) => {
          if (ele.children.length === 0) this.treeData[0].children.splice(index, 1)
        })

        this.mustmeetinginnerVisible = true
        this.musttreeDataChecked = this.addMeetingObj.mustJoin

        this.t = 1
        console.log(this.musttreeDataChecked)
      }
      if (this.flag === 1 && f === 0) {
        this.$nextTick(() => {
          this.$refs.tree1.setCheckedKeys([])
        })
        this.cantreeDataChecked = []
        this.addMeetingObj.mustJoin.forEach((item) => {
          this.treeData1[0].children.forEach((ele) => {
            ele.children.forEach((ele1, index) => {
              if (item === ele1.id) ele.children.splice(index, 1)
            })
          })
        })
        this.treeData1[0].children.forEach((ele, index) => {
          if (ele.children.length === 0) this.treeData1[0].children.splice(index, 1)
        })

        this.canmeetinginnerVisible = true
        this.cantreeDataChecked = this.addMeetingObj.canJoin
        this.t = 0
        console.log(this.cantreeDataChecked)
      }
      if (this.flag === 0 && f === 1) {
        this.$nextTick(() => {
          this.$refs.tree.setCheckedKeys([])
        })
        this.musttreeDataChecked = []
        console.log(this.treeData[0].children)
        this.addMeetingObj.canJoin.forEach((item) => {
          this.treeData[0].children.forEach((ele) => {
            ele.children.forEach((ele1, index) => {
              if (item === ele1.id) ele.children.splice(index, 1)
            })
          })
        })
        this.treeData[0].children.forEach((ele, index) => {
          if (ele.children.length === 0) this.treeData[0].children.splice(index, 1)
        })
        this.mustmeetinginnerVisible = true
        this.musttreeDataChecked = this.addMeetingObj.mustJoin
        this.t = 1
        console.log(this.addMeetingObj.mustJoin)
        console.log(this.addMeetingObj.canJoin)
      }
      if (this.flag === 0 && f === 0) {
        this.$nextTick(() => {
          this.$refs.tree1.setCheckedKeys([])
        })
        this.cantreeDataChecked = []
        this.addMeetingObj.mustJoin.forEach((item) => {
          this.treeData1[0].children.forEach((ele) => {
            ele.children.forEach((ele1, index) => {
              if (item === ele1.id) ele.children.splice(index, 1)
            })
          })
        })
        this.treeData1[0].children.forEach((ele, index) => {
          if (ele.children.length === 0) this.treeData1[0].children.splice(index, 1)
        })
        this.canmeetinginnerVisible = true
        this.cantreeDataChecked = this.addMeetingObj.canJoin
        this.t = 0
        console.log(this.addMeetingObj.mustJoin)
        console.log(this.addMeetingObj.canJoin)
      }
    },

    // tag关闭事件
    handleClose(tag, f) {
      console.log(this.addMeetingObj)
      // 清空必须参加人和可以参加人
      if (this.aidName !== this.$store.getters.showId && this.flag === 0) return this.$message.warning('発起人でなければ編集不可')
      this.addMeetingObj.mustJoin = []
      this.addMeetingObj.canJoin = []
      if (f === 1) {
        console.log(this.musttreeDataChecked)
        this.visitedTableList1.splice(this.visitedTableList1.indexOf(tag), 1)
        this.musttreeDataChecked.splice(this.musttreeDataChecked.indexOf(tag), 1)
        console.log(this.visitedTableList1)
        console.log(this.musttreeDataChecked)
      }
      if (f === 2) {
        this.visitedTableList2.splice(this.visitedTableList2.indexOf(tag), 1)
        this.cantreeDataChecked.splice(this.cantreeDataChecked.indexOf(tag), 1)
        console.log(this.visitedTableList2)
      }
      this.visitedTableList1.forEach((item) => {
        this.addMeetingObj.mustJoin.push(item.id)
      })
      this.visitedTableList2.forEach((item) => {
        this.addMeetingObj.canJoin.push(item.id)
      })
      this.meetingSearchccuserids()
    },
    //删除会议信息
    removeMeeting() {
      console.log(this.removeEventId)
      this.$confirm(this.$getMsg('I0004'), {
        cancelButtonText: 'キャンセル',
        confirmButtonText: '確認',
        type: 'warning'
      }).then(
        () => {
          this.axios
            .delete('/meeting/delete', {
              data: {
                mid: this.removeEventId
              }
            })
            .then((res) => {
              this.$message.success(this.$getMsg('I0003'))
              this.meetingVisible = false
              this.getMeetingAllInfo()
            })
            .catch((error) => {
              console.log(error)
            })
        },
        (res) => {
          console.log(res)
        }
      )
    },
    resetChecked() {
      this.meetingSearchccuserids()
      this.musttreeDataChecked = []
      this.cantreeDataChecked = []
    }
  }
}
</script>

<style scoped>
#Mettingarrange_container th .cell {
  background-color: #efefef;
}

#Mettingarrange_container .el-row .mytr {
  border: 0.5px solid rgb(200, 200, 200) !important;
}

#Mettingarrange_container .el-row .mytd {
  text-align: left !important;
  padding-left: 10px !important;
  border: 0.5px solid rgb(200, 200, 200) !important;
  background: #e6e6e6;
}

#Mettingarrange_container .el-row .mytd1 {
  text-align: left !important;
  padding-left: 10px !important;
  border: 0.5px solid rgb(200, 200, 200) !important;
  height: 35px;
}

.actived {
  background: #bdd9f8;
}

#Mettingarrange_container .el-row .mytable {
  margin-bottom: -16px;
  width: 98.5%;
}

.mytable1 {
  margin: auto;
}

.fc th,
.fc td {
  vertical-align: middle;
}

.fc .fc-scrollgrid-section table {
  height: 40px;
}

.fc-scroller-harness .fc-scroller {
  overflow: auto !important;
}

.fc .fc-view-harness {
  height: 670px !important;
}

.fc .fc-toolbar.fc-header-toolbar {
  margin-top: 5px;
}

.card1 {
  margin: auto;
  height: 330px;
  overflow: auto;
  width: 490px;
  border-top: 2px solid blue;
  margin-bottom: 60px;
  margin-top: 15px;
}

.save1 {
  margin: auto;
  margin-bottom: 5px;
  position: absolute;
  left: 50%;
  bottom: 5px;
  transform: translateX(-50%);
}

.el-tree {
  height: auto;
}

.mytd2 {
  width: 350px;
}
.mytd3 {
  width: 100px;
  text-align: right !important;
  padding-right: 10px !important;
  border: 1px solid #929292 !important;
  background: #e6e6e6;
}
.myMt {
  color: red !important;
  background-color: aqua !important;
  border: 1px solid aqua;
}

.unmyMt {
  color: red !important;
  background-color: rgb(193, 253, 253) !important;
  border: 1px solid rgb(193, 253, 253);
}

#Mettingarrange_container .fc-v-event .fc-event-main {
  color: unset;
}

#Mettingarrange_container .el-col div {
  background-color: unset;
}

.row1 {
  width: 100%;
  height: 700px;
  margin-right: 20px;
}

:deep(.fc .fc-scrollgrid-liquid) {
  height: 82.5% !important;
}
:deep(.fc .fc-button-primary:focus) {
  box-shadow: unset;
}
:deep(.fc .fc-button-primary:not(:disabled):active:focus, .fc .fc-button-primary:not(:disabled).fc-button-active:focus) {
  box-shadow: unset;
}
:deep(.fc .fc-toolbar.fc-header-toolbar) {
  margin-bottom: 16px;
}
.tddiv {
  max-height: 75px;
  overflow-y: auto;
  padding-top: 5px;
  padding-bottom: 5px;
}
.cardtree {
  height: 250px;
  overflow: auto;
}
</style>
